<template>
  <page-layout>
    <a-row :gutter="[10, 10]">
      <!-- 顶部区域 -->
      <a-col :span="24">
        <a-card>
          <div class="box-ver-hor-between">
            <div class="primary-color">课程管理</div>
            <div>
              <a-button type="primary" v-if="btnIsPowerByCode('unversity:school:new')" @click="goNewSchool">
                新增课程
              </a-button>
            </div>
          </div>
        </a-card>
      </a-col>
      <!-- 中心区域 -->
      <a-col :span="24">
        <a-card>
          <div class="mb-20">
            <!-- 查询参数 -->
            <pro-query :searchParam="searchParams.params"
                       :labelCol="{ span: 10 }"
                       :wrapperCol="{ span: 14 }"
                       @on-search="search"
            />
          </div>
          <!-- 列表 -->
          <pro-table ref="tableRef"
                     :pagination="pagination"
                     :fetch="fetch"
                     :columns="columns"
                     :operate="operate"
                     :param="state.param"
                     :row-selection="{ selectedRowKeys: state.selectedRowKeys, onChange: onSelectChange }"
          />
        </a-card>
      </a-col>
    </a-row>
  </page-layout>
</template>

<script setup>
import { message, Modal } from 'ant-design-vue'
import { page, remove } from '@/api/module/courseBaseInfo'
import { ref, reactive, onMounted } from 'vue'
import { useRouter } from 'vue-router'
import { btnIsPowerByCode, filterEmptyByObject } from '@/tools/common'
import { getDictByCodesReturnObj } from '@/tools/get-dict'
import dictEnum from '@/const/dict'

const tableRef = ref(null)
const router = useRouter()

const pagination = {
  pageNum: 1,
  pageSize: 10,
}

const search = params => {
  state.param = {
    ...state.param,
    ...filterEmptyByObject(params)
  }
}

const columns = [
  { dataIndex: "courseName", key: "courseName", title: "课程名称" },
  // { dataIndex: "", key: "address", title: "学科类别" },
  { dataIndex: "courseCode", key: "courseCode", title: "课程代码" },
  // { dataIndex: "", key: "sort", title: "项目名称" },
  // { dataIndex: "", key: "remark", title: "教材名" },
  // { dataIndex: "", key: "remark", title: "项目对接人" },
  { dataIndex: "createTime", key: "createTime", title: "创建时间" },
]

const operate = [
  {
    label: "详情",
    event: item => router.push({
      path: '/university/course-base-info/detail',
      query: { id: item.id }
    })
  },
  {
    label: "删除",
    event: item => {
      Modal.confirm({
        title: 'Are you sure delete this task?',
        content: 'Some descriptions',
        okText: 'Yes',
        okType: 'danger',
        cancelText: 'No',
        onOk() {
          remove({ id: item.id }).then(res => {
            if (res.code === 500) {
              return message.error('删除失败')
            }
            message.success('删除成功')
            tableRef.value.fetch({ current: 1 })
          })
        },
      })
    }
  }
]

const state = reactive({
  selectedRowKeys: [],
  param: {},
  visibleSave: false,
  visibleEdit: false,
  visibleInfo: false,
  recordEdit: {},
  recordInfo: {},
})

const goNewSchool = () => router.push('/university/course-base-info/add')

const fetch = async param => {
  const response = await page(param)

  if (response.code === 500) {
    return {
      data: [],
      total: 0
    }
  }

  return {
    data: response.data.record,
    total: response.data.total
  }
}

let dictLists = ref({})
let searchParams = reactive({
  params: []
})

onMounted(async () => {
  dictLists = await getDictByCodesReturnObj([
    dictEnum.YES_OR_NO,
    dictEnum.SCH_TYPE,
    dictEnum.SCH_SYSTEM,
    dictEnum.FOLLOW_PROGRESS,
    dictEnum.Intention_PROJECT
  ])

  searchParams.params = [
    // { span: 4, key: "courseType", type: "input", label: "学科类别", placeholder: '请输入' },
    { span: 5, key: "courseName", type: "input", label: "课程名称", placeholder: '请输入' },
    { span: 5, key: "courseCode", type: "input", label: "课程代码", placeholder: '请输入' },
    // { span: 5, key: "schoolCnName", type: "input", label: "项目名称", placeholder: '请输入' },
    // { span: 5, key: "schoolCnName", type: "input", label: "项目对接人", placeholder: '请输入' },
  ]
})
</script>
